﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" href="/libs/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="/css/public.css">
<!-- 引入moment.js -->
 <script src="/libs/moment.js"></script>
</head>

<body>

<div  id="main">
   <a href="/admin/news/create" class="layui-btn">添加新闻</a>
   <div class="layui-btn-group demoTable">
     <button class="layui-btn" data-type="delAll"">批量删除</button>

   </div>

   <table class="layui-table" lay-data="{width: 1892, height:332, loading:true,url:'/admin/news/newsList', page:true, id:'idTest',limit:5,limits:[3,6,9,12]}"
     lay-filter="demo">

    

     <thead>
       <tr>
         <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
         <th lay-data="{field:'id', width:60, sort: true}">ID</th>
         <th lay-data="{field:'title', width:120}">标题</th>
         <!-- 使用自定义列 -->
         <th lay-data="{field:'img_url',width:120}">新闻图片</th>
         <th lay-data="{field:'cateId', width:80}">所属分类</th>
         <th lay-data="{field:'author', width:80}">新闻编辑</th>
         <th lay-data="{field:'view_nums', width:80,sort: true}">访问量</th>
         <th lay-data="{field:'createdAt', width:135, sort: true}">添加时间</th>
         <th lay-data="{field:'updatedAt', width:135, sort: true}">修改时间</th>
         <th lay-data="{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}">操作</th>
       </tr>
     </thead>

      <!-- 自定义列 -->
      <script type="text/html" id="titleTpl">
        
      </script>

   </table>
</div>



<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script src="/libs/jquery.js"></script>
<script src="/libs/layui/layui.js" charset="utf-8"></script>

<script>
  console.log(moment('2022-07-29T01:42:04.000Z').format("YYYY-MM-DD HH:mm:ss"))

  layui.use('table', function () {
    var table = layui.table;
    //监听表格复选框选择
    table.on('checkbox(demo)', function (obj) {
      console.log(obj)
    });
    //监听工具条
    table.on('tool(demo)', function (obj) {
      var data = obj.data;
      if (obj.event === 'detail') {
        layer.msg('ID：' + data.id + ' 的查看操作');
      } else if (obj.event === 'del') {
        layer.confirm('真的删除行么', function (index) {
          obj.del();
          layer.close(index);
        });
      } else if (obj.event === 'edit') {
        layer.alert('编辑行：<br>' + JSON.stringify(data))
      }
    });

    var $ = layui.$,
      active = {
        //实现批量删除
        delAll: function () { //获取选中数据
          var checkStatus = table.checkStatus('idTest'),
            data = checkStatus.data;
            console.log(data)
        }
      };

    $('.demoTable .layui-btn').on('click', function () {
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });
  });
</script>
</body>
</html>
